<template>
    <a-modal 
    class="my-modal short" 
    v-model:visible="modal_show" 
    title="选择文件夹" 
    @ok="modelok"
     @cancel="model_cancel"
    width="500px" 
    :maskClosable="false" 
    :centered="true"
    :destroyOnClose="true"
    cancelText="不使用"
    okText="使用"
    >
        <div class="body-content">
            <a-row>
                 <a-col :span="3">
                    文件夹
                </a-col>
                <a-col :span="18">
                    <a-input size="small" placeholder="" v-model:value="select_dir" />
                </a-col>
                <a-col :span="1"></a-col>
                <a-col :span="2">
                    <a-tooltip  placement="right">
                    <template #title>选择xcopy输出文件夹</template>
                    <a-button @click="get_select_dir" style="margin: 0 auto;margin-right: 10px;">
                        <template #icon>
                        <plus-outlined />
                        </template>
                    </a-button>
                    </a-tooltip>
                </a-col>
            </a-row>
        </div>
    </a-modal>
    <modal_select_server_dir/>
</template>
<script>
import { defineAsyncComponent } from 'vue'
export default {
    data() {
        return {
            modal_show: false,
            select_dir:"",
            options:{
                dir_name: '',
                pre_dir: '',
            },


            //mitt
            mitt_select_out_dir_id:"",
            mitt_select_out_dir_back_id:"",


            mitt_modal_select_server_dir_back_id:"",

        };
    },
    beforeUnmount() {
        this.$mitt.off('select_out_dir',this.mitt_select_out_dir_id);
        this.$mitt.off('modal_select_server_dir_back',this.mitt_modal_select_server_dir_back_id);
    },
    mounted() { 
        this.mitt_select_out_dir_id=this.$mitt.on('select_out_dir',(uid,_options)  => {
            this.mitt_select_out_dir_back_id=uid
            this.select_dir="";
            this.modal_show = true;
        });
        this.mitt_modal_select_server_dir_back_id=this.$mitt.on('modal_select_server_dir_back',(type_select_dir)  => {
            if (type_select_dir.type == 'input') {
                this.select_dir = type_select_dir.val;
            }
        },this?.$?.uid);
    },
     components: {
        modal_select_server_dir: defineAsyncComponent(() => import('@/components/common/modal_select_server_dir.vue')),
    },
    methods: {
        get_select_dir() {
            this.$mitt.oemit('select_out_dir_back',this.select_dir,this.mitt_select_out_dir_back_id);
            this.$mitt.iemit('show_modal_select_server_dir', {
                type: 'input',
                showfile: false,
                avtive_dir: "",
            },this?.$?.uid);
        },
        async modelok() {
            if(this.select_dir){
                this.$mitt.oemit('select_out_dir_back',this.select_dir,this.mitt_select_out_dir_back_id);
            }
            else{
                this.$mitt.oemit('select_out_dir_back',undefined,this.mitt_select_out_dir_back_id);
            }
            this.modal_show = false;
        },
        model_cancel(){
            this.$mitt.oemit('select_out_dir_back',undefined,this.mitt_select_out_dir_back_id);
            this.modal_show = false;
        }
    },
};
</script>